/*
 * @Author: Otway
 * @Date: 2019-01-09 11:16:08
 * @LastEditors: Otway
 * @LastEditTime: 2019-08-30 18:50:09
 * @copyright: h-visions
 */
import React, { PureComponent } from 'react';
import { BasicLayout, BasicLayoutSearch } from '../../components/BasicLayout';
import { withRouter } from 'react-router';
import { Row, Col, Form, Select, Layout, Upload, Button, InputNumber, Table, Input, Alert, Spin, Modal, Drawer, Divider, Icon, Badge, PageHeader, Tabs, Card } from 'antd';





class BigExamineAssembleDetail extends PureComponent {
    constructor(props) {
        super(props);
        this.state = {
            title: '',
            queryForm: {},
            path: ''
        }
    }
    componentDidMount() {
        console.log(this.props.location)
        this.setState({
            title: this.props.location.data ? this.props.location.data.title : JSON.parse(localStorage.getItem('BigExamineAssemble_Report')).title,
            queryForm: this.props.location.data ? this.props.location.data.queryForm : JSON.parse(localStorage.getItem('BigExamineAssemble_Report')).queryForm,
            path: this.props.location.data ? this.props.location.data.path : JSON.parse(localStorage.getItem('BigExamineAssemble_Report')).path,
        })
    }
    componentWillUnmount() {
        this.setState = () => {
            return;
        };
    }
    handlePrint = () => {
        let printReport = document.getElementById('printReport')
        console.log(printReport)
        var flag = false;
        console.log(printReport.offsetHeight)
        if (printReport.offsetHeight === 0) {
            flag = false;
            // return;
        } else {
            flag = true
        }
        if (flag) {
            clearTimeout(times);
            setTimeout(() => {
                var printInnerHTML = printReport.innerHTML;
                window.document.body.innerHTML = printInnerHTML
                window.print();
                window.location.reload();
            });
        } else {
            var times = setTimeout(() => {
                this.print()
            }, 500);
        }
    }

    render() {
        const { form: { getFieldDecorator } } = this.props;
        const { title, queryForm, path } = this.state

        let dataSource = [], index = 0
        if (queryForm?.dataSource?.length > 0) {
            queryForm.dataSource.map(item => {
                if (dataSource.length > 0) {
                    let a, newItem, newIndex
                    for (let i in dataSource) {
                        a = dataSource[i].find(e => e.name == item.name)
                        if (a) {
                            newItem = item
                            newIndex = i
                            break
                        }
                        newItem = item
                    }
                    if (a) {
                        dataSource[newIndex].push(newItem)
                    } else {
                        dataSource[index] = []
                        dataSource[index].push(newItem)
                        index++
                    }
                } else {
                    dataSource[index] = []
                    dataSource[index].push(item)
                    index++
                }
            })
        }
        console.log(dataSource, 'dataSource');

        let newDataSource = [], length = 0, oldLen = 0, pages = [], rowLen = 14
        dataSource.map((item, index) => {
            oldLen = item.length
            length += item.length
            if (length - rowLen > 0) {
                let count = length % rowLen
                newDataSource.push(item.slice(0, oldLen - count))
                pages[pages.length] = newDataSource
                length = count
                newDataSource = []
                newDataSource.push(item.slice(oldLen - count))
            } else if (length - rowLen == 0) {
                newDataSource.push(item)
                pages[pages.length] = newDataSource
                length = 0
                newDataSource = []
            } else {
                newDataSource.push(item)
            }
            if (index == dataSource.length - 1 && newDataSource.length > 0) {
                pages[pages.length] = newDataSource
            }
        })
        console.log(pages, 'pages');

        let aindex = 1, aname = ''
        return (
            <div>
                <BasicLayoutSearch>
                    <PageHeader
                        style={{ padding: '4px 24px' }}
                        onBack={() => this.props.history.push({ pathname: '/' + path })}
                        title={<div>{title ? title : '大机装配检查记录表（装配过程）'}</div>}
                        extra={<Button type='primary' icon='printer' onClick={this.handlePrint}>打印</Button>}
                    >
                    </PageHeader>
                </BasicLayoutSearch>
                <Layout className="layout-model">
                    <div id='printReport'>
                        {
                            pages?.length > 0 ?
                                pages.map((it, ind) => {
                                    return (
                                        <div style={{ width: 900, textAlign: 'center', margin: '0 auto', padding: '40px 100px 20px' }} key={'pages_' + ind}>
                                            <div style={{ fontSize: 20, fontWeight: 'bold', padding: '20px 0 30px 0' }}>附录6  大机装配检查记录表（装配过程）</div>
                                            {
                                                ind == 0 ?
                                                    <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                                                        <div><span>机型/批号：</span><span style={{ display: 'inline-block', width: 400, textAlign: 'left', borderBottom: '1px solid #000000a6' }}>{queryForm?.formData?.model}</span></div>
                                                        {
                                                            // isInPlant   0 厂外  1 厂内
                                                            queryForm?.formData?.isInPlant == 1 ?
                                                                <div style={{ textAlign: 'right' }}>厂外（） 厂内（√）</div>
                                                                :
                                                                queryForm?.formData?.isInPlant == 0 ?
                                                                    <div style={{ textAlign: 'right' }}>厂外（√） 厂内（）</div>
                                                                    :
                                                                    <div style={{ textAlign: 'right' }}>厂外（） 厂内（）</div>
                                                        }
                                                    </div>
                                                    : null
                                            }
                                            <br />
                                            <table border={1} cellPadding={0} cellSpacing={0}>
                                                <colgroup>
                                                    <col width={50} />
                                                    <col width={50} />
                                                    <col width={500} />
                                                    <col width={100} />
                                                </colgroup>
                                                <tbody>
                                                    <tr height={50}>
                                                        <td>序号</td>
                                                        <td>类别</td>
                                                        <td>要求项目内容</td>
                                                        <td>确认</td>
                                                    </tr>
                                                    {
                                                        it.map((e, i) => {
                                                            // 计算序号
                                                            aname = ind == 0 && i == 0 ? e[0].name : aname;
                                                            aindex = aname == e[0].name ? aindex : aindex + 1;
                                                            aname = aname == e[0].name ? aname : e[0].name;
                                                            return e.map((item, index) => {
                                                                return (
                                                                    <tr key={'pages_' + ind + '_' + index} height={70}>
                                                                        {index > 0 ? null : <td rowSpan={e.length}>{aindex}</td>}
                                                                        {index > 0 ? null : <td rowSpan={e.length} style={{ padding: 5 }}>{item.name}</td>}
                                                                        <td style={{ textAlign: 'left', padding: 5 }}>{/* {i + 1}. {num + index + 1}.*/}  {item.checkStandard}</td>
                                                                        <td>{item.confirm}</td>
                                                                    </tr>
                                                                )
                                                            })
                                                        })
                                                    }
                                                </tbody>
                                            </table>
                                            {
                                                ind == pages.length - 1 ?
                                                    <>
                                                        <div style={{ display: 'flex', paddingTop: 20, textAlign: 'left' }}>
                                                            <div style={{ width: '49%' }}><span>装配员：</span><span style={{ display: 'inline-block', width: '80%', borderBottom: '1px solid #000000a6' }}></span></div>
                                                            <div>&emsp;</div>
                                                            <div style={{ width: '49%' }}><span>日期：</span><span style={{ display: 'inline-block', width: '80%', borderBottom: '1px solid #000000a6' }}></span></div>
                                                        </div>
                                                        <div style={{ display: 'flex', paddingTop: 20, textAlign: 'left' }}>
                                                            <div style={{ width: '49%' }}><span>组长确认：</span><span style={{ display: 'inline-block', width: '76%', borderBottom: '1px solid #000000a6' }}></span></div>
                                                            <div>&emsp;</div>
                                                            <div style={{ width: '49%' }}><span>日期：</span><span style={{ display: 'inline-block', width: '80%', borderBottom: '1px solid #000000a6' }}></span></div>
                                                        </div>
                                                        <div style={{ width: '100%', textAlign: 'left', paddingTop: 20 }}><span>结论：</span><span style={{ display: 'inline-block', width: '90%', borderBottom: '1px solid #000000a6' }}></span></div>
                                                        <div style={{ textAlign: 'right', paddingTop: 10 }}>表格编号：{queryForm?.formData?.formCoding}</div>
                                                    </>
                                                    :
                                                    <div style={{ textAlign: 'right', paddingTop: 10 }}>表格编号：{queryForm?.formData?.formCoding}</div>
                                            }
                                        </div>)
                                })
                                : null
                        }
                    </div>
                </Layout>
            </div>
        );
    }
}
export default Form.create()(withRouter(BigExamineAssembleDetail));